<template>
  <div class="wrapp">
    <div class="head">
      <div class="title">用户管理</div>
      <Button type="primary" style="width:86px;height:32px;" @click="toAddUserPage">新增</Button>
    </div>

    <div class="banner">
      <div class="search">
        <Input type="text" placeholder="手机号/姓名/钱包地址" style="width:200px;" v-model="searchCond" @keyup.enter.native="keyset_1($event)" />

        <Button type="primary" style="margin-left:20px;" @click="ensureAction">确定</Button>
      </div>

      <div class="summaryView mt_10 pt_10">
        <span class="f_16" v-if="userSummaryData.userCount">用户总数：{{userSummaryData.userCount}}</span>
        <span class="f_16" v-else>用户总数：---</span>
        &nbsp;&nbsp;&nbsp;&nbsp;
        <span class="f_16" v-if="userSummaryData.minerCount">用户矿机总数：{{userSummaryData.minerCount}}</span>
        <span class="f_16" v-else>用户矿机总数：---</span>
        &nbsp;&nbsp;&nbsp;&nbsp;
        <span class="f_16" v-if="userSummaryData.computePowerSum">用户算力总数：{{userSummaryData.computePowerSum}}MB</span>
        <span class="f_16" v-else>用户算力总数：---</span>
        &nbsp;&nbsp;&nbsp;&nbsp;
        <span class="f_16" v-if="String(userSummaryData.balanceStorjSum)">用户余额总数（Stroj/PLC/UT/FIL）：{{userSummaryData.balanceStorjSum}}/{{userSummaryData.balancePlcSum}}/{{userSummaryData.balanceUtSum}}/{{userSummaryData.balanceFilSum}}</span>
        <span class="f_16" v-else>用户余额总数（Stroj/PLC/UT）：---</span>
      </div>

      <div class="table">
        <Table :columns="columnsData" :data="userShowData" :border="true" :loading="isLoading">

          <template slot-scope="{ row, index }" slot="mobile">
            <Input type="text" v-model="editMobile" v-if="editIndex === index" />
            <span v-else style="border-bottom:1px solid;">{{ row.mobile }}</span>
          </template>

          <template slot-scope="{ row, index }" slot="name">
            <Input type="text" v-model="editName" v-if="editIndex === index" />
            <span v-else style="border-bottom:1px solid;">{{ row.name }}</span>
          </template>

          <template slot-scope="{ row, index }" slot="cashWallet">
            <Input type="text" v-model="editWallet" v-if="editIndex === index" />
            <Tooltip :content="row.cashWallet" v-else max-width="200" style="border-bottom:1px solid;">
              {{hideWord(row.cashWallet)}}
            </Tooltip>
          </template>

          <template slot-scope="{ row, index }" slot="utCashWallet">
            <Input type="text" v-model="editUTWallet" v-if="editIndex === index" />
            <Tooltip :content="row.utCashWallet" v-else max-width="200" style="border-bottom:1px solid;">
              {{hideWord(row.utCashWallet)}}
            </Tooltip>
          </template>

          <template slot-scope="{ row, index }" slot="action">
            <div v-if="editIndex === index">
              <Button style="margin-right: 5px;" type="primary" @click="handleSave(index)">保存</Button>
              <Button @click="editIndex = -1">取消</Button>
            </div>
            <div v-else>
              <Button style="margin-right: 5px;" @click="handleEdit(row, index)">编辑</Button>
              <Button style="margin-right: 5px;" type="primary" @click="handleSubsidy(row, index)">补贴</Button>
              <Button type="error" @click="deleteUserAction(row, index)">删除</Button>
            </div>
          </template>
        </Table>
        <Page :total="pageTotal" :current="pageNum" show-total placement="top" @on-change="handlePage" style="margin-top:20px;" :page-size="pageSize"></Page>
      </div>

      <Modal v-model="StorjBalanceShow" :mask-closable="false" width="1076">
        <div class="balanceTitle">
          <span style="font-size:20px;">Storj</span>
          <span class="ml">{{name}}</span>
          <span class="ml">{{phone}}</span>
          <span class="ml">{{StrojNum}}Storj</span>
        </div>
        <Table :columns="StorjCoulumns" :data="StorjShowData" :border="true" :loading="isStorjLoading"></Table>
        <Page :total="StorjTotal" :current="StorjPageNum" :page-size="StorjPageSize" show-total placement="top" @on-change="StorjHandlePage" style="margin-top:20px;"></Page>
      </Modal>

      <Modal v-model="PlcBalanceShow" :mask-closable="false" width="836">
        <div class="balanceTitle">
          <span style="font-size:20px;">PLC</span>
          <span class="ml">{{name}}</span>
          <span class="ml">{{phone}}</span>
          <span class="ml">{{PlcNum}}PLC</span>
        </div>
        <Table :columns="PlcCoulumns" :data="PlcShowData" :border="true" :loading="isPlcLoading"></Table>
        <Page :total="PlcTotal" :current="PlcPageNum" :page-size="StorjPageSize" show-total placement="top" @on-change="PlcHandlePage" style="margin-top:20px;"></Page>
      </Modal>

      <Modal v-model="FilBranchNum" :mask-closable="false" width="836">
        <Table :columns="FilBranchCoulumns" :data="FilBranchData" :border="true" :loading="isFilBranch"></Table>
        <Page :total="FilBranchTotal" :current="FilBranchPageNum" :page-size="FilBranchPageSize" show-total placement="top" @on-change="FilBranchHandlePage" style="margin-top:20px;"></Page>
      </Modal>
      <Modal v-model="FilBalanceShow" :mask-closable="false" width="836">
        <div class="balanceTitle">
          <span style="font-size:20px;">FIL</span>
          <span class="ml">{{name}}</span>
          <span class="ml">{{phone}}</span>
          <span class="ml">{{FilNum}}FIL</span>
        </div>
        <Table :columns="FilCoulumns" :data="FilShowData" :border="true" :loading="isFilLoading">
          <template slot-scope="{ row, index }" slot="projectRoleName">
            <span>{{row.projectRoleName}}收益</span>
          </template>
        </Table>
        <Page :total="FilTotal" :current="FilPageNum" :page-size="FilPageSize" show-total placement="top" @on-change="FilHandlePage" style="margin-top:20px;"></Page>
      </Modal>

      <Modal v-model="UtBalanceShow" :mask-closable="false" width="1024">
        <div class="balanceTitle">
          <span style="font-size:20px;">UT</span>
          <span class="ml">{{name}}</span>
          <span class="ml">{{phone}}</span>
          <span class="ml">{{UtNum}}UT</span>
        </div>
        <Table :columns="UtCoulumns" :data="UtShowData" :border="true" :loading="isUtLoading"></Table>
        <Page :total="UtTotal" :current="UtPageNum" :page-size="UtPageSize" show-total placement="top" @on-change="UtHandlePage" style="margin-top:20px;"></Page>
      </Modal>

    </div>
  </div>
</template>

<script>
import apis from "../../util/apis.js";

export default {
  name: "UserInfo",
  data() {
    return {
      FilNum: null,
      name: "",
      phone: "",
      StrojNum: 0,
      PlcNum: 0,
      UtNum: 0,
      //Fil余额
      FilTotal: 0,
      FilPageNum: 1,
      FilPageSize: 7,
      FilBalanceShow: false,
      FilUser: "",
      isFilLoading: false,
      //storj余额
      StorjTotal: 0,
      StorjPageNum: 1,
      StorjPageSize: 7,
      StorjBalanceShow: false,
      StorjUser: "",
      isStorjLoading: false,
      //plc余额
      PlcTotal: 0,
      PlcBalanceShow: false,
      PlcPageNum: 1,
      PlcPageSize: 7,
      PlcjUser: "",
      isPlcLoading: false,
      //下线数
      FilBranchNum: false,
      isFilBranch: false,
      FilBranchTotal: 0,
      FilBranchPageNum: 1,
      FilBranchPageSize: 7,
      //UT余额
      UtTotal: 0,
      UtBalanceShow: false,
      UtPageNum: 1,
      UtPageSize: 7,
      UtUser: "",
      isUtLoading: false,

      ////////////////////////
      isLoading: true,
      selectData: "3",
      selectStatus: "1",
      searchCond: "",

      selectList: [
        {
          value: "1",
          label: "启用"
        },
        {
          value: "2",
          label: "未启用"
        },
        {
          value: "3",
          label: "全部"
        }
      ],
      pageTotal: 0,
      pageNum: 1,
      pageSize: 20,
      columnsData: [
        {
          title: "用户ID",
          key: "userId",
          align: "center",
          width: 120
        },
        {
          title: "手机号码",
          key: "mobile",
          slot: "mobile",
          align: "center",
          width: 160
        },
        {
          title: "姓名",
          key: "name",
          slot: "name",
          align: "center",
          width: 160
        },
        {
          title: "微信ID",
          key: "wechatUnionId",
          align: "center",
          width: 120
        },
        {
          title: "用户钱包地址",
          key: "cashWallet",
          slot: "cashWallet",
          align: "center",
          width: 160
        },
        {
          title: "发展下线数",
          key: "inviteCount",
          align: "center",
          width: 110,
          render: (h, params) => {
            return h("div", [
              h(
                "span",
                {
                  style: {
                    borderBottom: "1px solid",
                    cursor: "pointer",
                    color: "red"
                  },
                  on: {
                    click: () => {
                      this.showBranchList(params);
                    }
                  }
                },
                this.userShowData[params.index].inviteCount
              )
            ]);
          }
        },
        {
          title: "矿机数",
          key: "minerCount",
          align: "center",
          width: 120
        },
        {
          title: "节点",
          key: "minerNodeCount",
          align: "center",
          width: 80
        },
        {
          title: "算力",
          key: "computePowerCount",
          align: "center",
          width: 80
        },
        {
          title: "FIl余额",
          key: "filAmount",
          align: "center",
          width: 150,
          render: (h, params) => {
            return h("div", [
              h(
                "span",
                {
                  style: {
                    borderBottom: "1px solid",
                    cursor: "pointer",
                    color: "red"
                  },
                  on: {
                    click: () => {
                      this.showFilList(params);
                    }
                  }
                },
                this.userShowData[params.index].filAmount
              )
            ]);
          }
        },
        {
          title: "STORJ余额",
          key: "storjAmount",
          align: "center",
          width: 150,
          render: (h, params) => {
            return h("div", [
              h(
                "span",
                {
                  style: {
                    borderBottom: "1px solid",
                    cursor: "pointer",
                    color: "red"
                  },
                  on: {
                    click: () => {
                      this.showStorjList(params);
                    }
                  }
                },
                this.userShowData[params.index].storjAmount
              )
            ]);
          }
        },
        {
          title: "PLC余额",
          key: "plcAmount",
          align: "center",
          width: 150,
          render: (h, params) => {
            return h("div", [
              h(
                "span",
                {
                  style: {
                    borderBottom: "1px solid",
                    cursor: "pointer",
                    color: "red"
                  },
                  on: {
                    click: () => {
                      this.showPlcList(params);
                    }
                  }
                },
                this.userShowData[params.index].plcAmount
              )
            ]);
          }
        },
        {
          title: "UT钱包",
          key: "utCashWallet",
          slot: "utCashWallet",
          align: "center",
          width: 180
        },
        {
          title: "UT余额",
          key: "utAmount",
          align: "center",
          width: 150,
          render: (h, params) => {
            return h("div", [
              h(
                "span",
                {
                  style: {
                    borderBottom: "1px solid",
                    cursor: "pointer",
                    color: "red"
                  },
                  on: {
                    click: () => {
                      this.showUtList(params);
                    }
                  }
                },
                this.userShowData[params.index].utAmount
              )
            ]);
          }
        },
        {
          title: "操作",
          fixed: "right",
          slot: "action",
          align: "center",
          width: 250
        }
      ],
      userShowData: [],
      userSummaryData: {},
      editIndex: -1,
      editMobile: "",
      editName: "",
      editWallet: "",
      editUTWallet: "",
      StorjCoulumns: [
        {
          title: "日期",
          key: "date",
          align: "center",
          width: 200
        },
        {
          title: "交易类型",
          key: "tradeType",
          align: "center",
          width: 120
        },
        {
          title: "显示挖矿收益",
          key: "displayProfitAmount",
          align: "center",
          width: 120
        },
        {
          title: "补贴数量",
          key: "subsidyAmount",
          align: "center",
          width: 120
        },
        {
          title: "实际挖矿数量",
          key: "actualProfitAmount",
          align: "center",
          width: 120
        },
        {
          title: "历史收益总额",
          key: "historyProfitTotal",
          align: "center",
          width: 120
        },
        {
          title: "历史提现总额",
          key: "historyCashTotal",
          align: "center",
          width: 120
        },
        {
          title: "当前Storj余额",
          key: "balanceAmount",
          align: "center",
          width: 120
        }
      ],
      StorjShowData: [],
      PlcCoulumns: [
        {
          title: "日期",
          key: "date",
          align: "center",
          width: 200
        },
        {
          title: "交易类型",
          key: "tradeType",
          align: "center",
          width: 120
        },
        {
          title: "显示挖矿收益",
          key: "displayProfitAmount",
          align: "center",
          width: 120
        },

        {
          title: "历史收益总额",
          key: "historyProfitTotal",
          align: "center",
          width: 120
        },
        {
          title: "历史提现总额",
          key: "historyCashTotal",
          align: "center",
          width: 120
        },
        {
          title: "当前PLC余额",
          key: "balanceAmount",
          align: "center",
          width: 120
        }
      ],
      PlcShowData: [],
      UtShowData: [],
      UtCoulumns: [
        {
          title: "日期",
          key: "date",
          align: "center"
        },
        {
          title: "显示挖矿收益",
          key: "displayProfitAmount",
          align: "center"
        },
        {
          title: "当前Ut余额",
          key: "balanceAmount",
          align: "center"
        }
      ],
      FilBranchCoulumns: [
        {
          title: "名称",
          key: "name",
          align: "center"
        },
        {
          title: "微信ID",
          key: "wechatUnionId",
          align: "center"
        },
        {
          title: "手机号",
          key: "mobile",
          align: "center"
        }
      ],
      FilBranchData: [],
      FilCoulumns: [
        {
          title: "日期",
          key: "date",
          align: "center",
          width: 200
        },
        {
          title: "交易类型",
          key: "tradeType",
          align: "center",
          width: 120
        },
        {
          title: "交易来源",
          key: "projectRoleName",
          slot: "projectRoleName",
          align: "center",
          width: 120
        },
        {
          title: "显示挖矿收益",
          key: "displayProfitAmount",
          align: "center",
          width: 120
        },

        {
          title: "历史收益总额",
          key: "historyProfitTotal",
          align: "center",
          width: 120
        },
        {
          title: "历史提现总额",
          key: "historyCashTotal",
          align: "center",
          width: 120
        },
        {
          title: "当前FIL余额",
          key: "balanceAmount",
          align: "center",
          width: 120
        }
      ],
      FilShowData: [
        {
          date: "2018-01-03",
          tradeType: "收益",
          displayProfitAmount: 212323,
          historyProfitTotal: 23434,
          historyCashTotal: 23434,
          balanceAmount: 3434444
        }
      ],
      onLineId: null,
      onLineSearch: null,
    };
  },
  methods: {
    //////////////////////////////////////////////发展下线数////////////////////////////
    FilBranchHandlePage(value) {
      this.FilBranchPageNum = value
      this.onlineNum(this.onLineId, this.FilBranchPageNum - 1);
    },
    showBranchList(params) {
      this.FilBranchNum = true;
      this.onlineNum(params.row.userId, 0);
      this.onLineId = params.row.userId;
    },
    keyset(ev) {
      if (ev.keyCode == 13) {
        this.onlineNum(this.onLineId, 0);
      }
    },
    /////////////////////发展下线数////////
    onlineNum(id, pageNum) {
      let token = this.$localStorage.storageGet("TOKEN");
      if (!token) {
        this.$router.push({
          name: "Login"
        });
        return;
      }
      let url = ""
      if (!this.onLineSearch) {
        url = apis.onLineApi + "/" + id + "?size=" + this.FilBranchPageSize + "&page=" + pageNum;
      } else {
        url = apis.onLineApi + "/" + id + "?size=" + this.FilBranchPageSize + "&page=" + pageNum + "&keyword=" + this.onLineSearch;
      }

      this.$axios({
        method: "get",
        url: url,
        headers: {
          Authorization: "Bearer " + token
        }
      })
        .then(res => {
          if (res.status == "200") {
            this.isFilBranch = false;
            this.FilBranchTotal = parseInt(res.headers["x-total-count"]);
            this.FilBranchData = res.data;
            console.log(this.FilBranchData)
          } else {
            this.$Message.error(res.data.detail);
          }
        })
        .catch(err => {
          this.$Message.error(err.response.data.message);
        });
    },
    //////////////////////////////////////////////余额操作//////////////////////////////
    //余额
    getBalanceData(pageNum, type) {
      let token = this.$localStorage.storageGet("TOKEN");
      if (!token) {
        this.$router.push({
          name: "Login"
        });
        return;
      }

      let url = apis.balanceList;
      if (type == 1) {
        this.isStorjLoading = true;
        url =
          url +
          "?" +
          "page=" +
          pageNum +
          "&size=" +
          this.StorjPageSize +
          "&type=" +
          type +
          "&userId=" +
          this.StorjUser;
      } else if (type == 2) {
        this.isPlcLoading = true;
        url =
          url +
          "?" +
          "page=" +
          pageNum +
          "&size=" +
          this.PlcPageSize +
          "&type=" +
          type +
          "&userId=" +
          this.PlcjUser;
      } else if (type == 4) {
        this.isFilLoading = true;
        url =
          url +
          "?" +
          "page=" +
          pageNum +
          "&size=" +
          this.FilPageSize +
          "&type=" +
          type +
          "&userId=" +
          this.FilUser;
      }
      else {
        this.isUtLoading = true;
        url =
          url +
          "?" +
          "page=" +
          pageNum +
          "&size=" +
          this.UtPageSize +
          "&type=" +
          type +
          "&userId=" +
          this.UtUser;
      }
      this.$axios({
        method: "get",
        url: url,
        headers: {
          Authorization: "Bearer " + token
        }
      })
        .then(res => {
          if (res.status == "200") {
            let data = res.data;
            data.forEach(element => {
              if (element.tradeType == 1) {
                element.tradeType = "提现";
              } else if (element.tradeType == 2) {
                element.tradeType = "收益";
              } else if (element.tradeType == 3) {
                element.tradeType = "节点收益";
              } else if (element.tradeType == 4) {
                element.tradeType = "算力收益";
              } else {
                element.tradeType = "共建收益";
              }
            });
            if (type == 1) {
              this.StorjShowData = data;
              this.isStorjLoading = false;
              this.StorjTotal = parseInt(res.headers["x-total-count"]);
            } else if (type == 2) {
              this.PlcShowData = data;
              this.isPlcLoading = false;
              this.PlcTotal = parseInt(res.headers["x-total-count"]);
            } else if (type == 4) {
              data.forEach(element => {
                if (element.projectRoleName === null) {
                  if (element.minerFieldName === null || element.minerFieldName === "") {
                    element.projectRoleName = "";
                  } else {
                    element.projectRoleName = element.minerFieldName
                  }

                } else {
                  element.projectRoleName = element.projectRoleName + "/" + element.minerFieldName
                }

              })
              this.FilShowData = data;
              this.isFilLoading = false;
              this.FilTotal = parseInt(res.headers["x-total-count"]);
            }
            else {
              this.UtShowData = data;
              this.isUtLoading = false;
              this.UtTotal = parseInt(res.headers["x-total-count"]);
            }
          } else {
            this.$Message.error(res.data.detail);
          }
        })
        .catch(err => {
          this.$Message.error(err.response.data.message);
        });
    },

    /////////////////////STORJ///////////////////////////////////
    cancelStorj() {
      this.StorjBalanceShow = false;
    },
    tuichuStorj() {
      this.StorjBalanceShow = false;
    },
    showStorjList(params) {
      this.StorjBalanceShow = true;
      this.StorjUser = params.row.userId;
      this.name = params.row.name;
      this.phone = params.row.mobile;
      this.StrojNum = params.row.storjAmount;
      this.getBalanceData(this.StorjPageNum - 1, 1);
    },
    StorjHandlePage(value) {
      this.StorjPageNum = value;
      this.getBalanceData(this.StorjPageNum - 1, 1);
    },
    /////////////////////////PLC///////////////////////////////////////////
    cancelPlc() {
      this.PlcBalanceShow = false;
    },
    tuichuPlc() {
      this.PlcBalanceShow = false;
    },
    showPlcList(params) {
      this.PlcBalanceShow = true;
      this.PlcjUser = params.row.userId;
      this.name = params.row.name;
      this.phone = params.row.mobile;
      this.PlcNum = params.row.plcAmount;
      this.getBalanceData(this.PlcPageNum - 1, 2);
    },
    PlcHandlePage(value) {
      this.PlcPageNum = value;
      this.getBalanceData(this.PlcPageNum - 1, 2);
    },
    /////////////////////////FIL///////////////////////////////////////////
    showFilList(params) {
      this.FilBalanceShow = true;
      this.FilUser = params.row.userId;
      this.name = params.row.name;
      this.phone = params.row.mobile;
      this.FilNum = params.row.filAmount;
      this.getBalanceData(this.FilPageNum - 1, 4);
    },
    FilHandlePage(value) {
      this.FilPageNum = value;
      this.getBalanceData(this.FilPageNum - 1, 4);
    },

    ///////////////////////////UT////////////////////////////////////////////////
    cancelUt() {
      this.UtBalanceShow = false;
    },
    tuichuUt() {
      this.UtBalanceShow = false;
    },
    showUtList(params) {
      this.UtBalanceShow = true;
      this.UtUser = params.row.userId;
      this.name = params.row.name;
      this.phone = params.row.mobile;
      this.UtNum = params.row.utAmount;
      this.getBalanceData(this.UtPageNum - 1, 3);
    },
    UtHandlePage(value) {
      this.UtPageNum = value;
      this.getBalanceData(this.UtPageNum - 1, 3);
    },
    ////////////////////////////////////////////////////////////////////////////////////
    //补贴设置
    handleSubsidy(row, index) {
      this.$router.push({
        name: "UserSubsidy",
        query: {
          param: row
        }
      });
    },
    hideWord(string) {
      if (string) {
        string = String(string);
        let len = string.length;
        let stringBefore = string.slice(0, 8);
        let stringBeHand = string.slice(len - 8, len + 1);
        let newString = stringBefore + "..." + stringBeHand;
        return newString;
      } else {
        return "";
      }
    },
    handleEdit(row, index) {
      this.editIndex = index;
      this.editMobile = row.mobile;
      this.editName = row.name;
      this.editWallet = row.cashWallet;
      this.editUTWallet = row.utCashWallet;
    },

    //保存编辑信息
    handleSave(index) {
      if (!this.editMobile) {
        this.$Message.warning("请输入手机号码");
        return;
      } else {
        if (this.editMobile.length != 11) {
          this.$Message.warning("请输入正确的手机号");
          return;
        } else if (this.editMobile[0] != "1") {
          this.$Message.warning("请输入正确的手机号");
          return;
        }
      }

      if (this.editWallet) {
        if (this.editWallet[0] != "0" || this.editWallet[1] != "x") {
          this.$Message.warning("主钱包地址以0x开头，亲");
          return;
        } else if (this.editWallet.length != 42) {
          console.log(this.editWallet.length);
          this.$Message.warning("主钱包地址要42位呢，猪头");
          return;
        }
      }

      if (this.editUTWallet) {
        if (this.editUTWallet[0] != "U") {
          this.$Message.warning("UT钱包地址以’U'开头哦，能不能用点心填");
          return;
        } else if (this.editUTWallet.length != 34) {
          this.$Message.warning("UT钱包地址要34位，哥");
          return;
        }
      }

      this.editIndex = -1;
      let payload = {
        cashWallet: this.editWallet,
        id: this.userShowData[index].userId,
        mobile: this.editMobile,
        name: this.editName,
        utCashWallet: this.editUTWallet
      };

      this.$Modal.confirm({
        title: "确认提交信息",
        content:
          "<div>手机号码：" +
          this.editMobile +
          "</div>" +
          "<div>姓名:" +
          this.editName +
          "</div>" +
          "<div>用户钱包地址:" +
          this.editWallet +
          "</div>" +
          "<div>UT钱包地址:" +
          this.editUTWallet +
          "</div>",
        onOk: () => {
          this.updateUserInfo(payload);
        },
        onCancel: () => {
          this.$Message.info("已取消提交");
        }
      });
    },

    //更新用户信息
    updateUserInfo(payload) {
      let token = this.$localStorage.storageGet("TOKEN");
      if (!token) {
        this.$router.push({
          name: "Login"
        });
        return;
      }

      let url = apis.addUserApi;

      this.$axios({
        method: "put",
        url: url,
        headers: {
          Authorization: "Bearer " + token
        },
        data: payload
      })
        .then(res => {
          console.log(res);
          if (res.status == "200") {
            this.$Message.info("已修改");
            let cond = this.require();
            this.getUserData(this.pageNum - 1, cond);
          } else {
            this.$Message.error(res.data.detail);
            this.editMobile = this.userShowData[index].mobile;
            this.editName = this.userShowData[index].name;
            this.editWallet = this.userShowData[index].cashWallet;
            this.editUTWallet = this.userShowData[index].UTwallet;
          }
        })
        .catch(err => {
          this.$Message.error(err.response.data.message);
        });
    },

    //删除用户
    deleteUserAction(row, index) {
      let id = this.userShowData[index].userId;
      this.$Modal.confirm({
        title: "提醒",
        content: "确定要删除该用户吗？",
        onOk: () => {
          let token = this.$localStorage.storageGet("TOKEN");
          if (!token) {
            this.$router.push({
              name: "Login"
            });
            return;
          }

          let url = apis.addUserApi + "/" + id;

          this.$axios({
            method: "delete",
            url: url,
            headers: {
              Authorization: "Bearer " + token
            }
          })
            .then(res => {
              console.log(res);
              if (res.status == "200") {
                this.$Message.info("已删除");
                let cond = this.require();
                this.getUserData(this.pageNum - 1, cond);
              } else {
                this.$Message.error(res.data.detail);
              }
            })
            .catch(err => {
              this.$Message.error(err.response.data.message);
            });
        },
        onCancel: () => {
          this.$Message.info("已取消");
        }
      });
    },

    gainUserSummary() {
      //userSummary
      let token = this.$localStorage.storageGet("TOKEN");
      if (!token) {
        this.$router.push({
          name: "Login"
        });
        return;
      }

      let url = apis.userSummary;

      this.$axios({
        method: "get",
        url: url,
        headers: {
          Authorization: "Bearer " + token
        }
      })
        .then(res => {
          if (res.status == "200") {
            let data = res.data;
            this.userSummaryData = data;
          } else {
            this.$Message.error(res.data.detail);
          }
        })
        .catch(err => {
          this.$Message.error(err.response.data.message);
        });
    },
    //跳转新增页面
    toAddUserPage() {
      this.$router.push({
        name: "AddUser"
      });
    },
    /////////////////////////以下是我最新的修改//////////////////////////////////////////
    //获取所有用户列表
    getUserData(pageNum, cond) {
      this.isLoading = true;
      let token = this.$localStorage.storageGet("TOKEN");
      if (!token) {
        this.$router.push({
          name: "Login"
        });
        return;
      }

      let url = "";
      if (!cond) {
        url =
          apis.addUserApi + "?" + "page=" + pageNum + "&size=" + this.pageSize;
      } else {
        url =
          apis.addUserApi + "?" + "page=" + pageNum + "&size=" + this.pageSize;
        if (cond.keyword) {
          url = url + "&keyword=" + cond.keyword;
        }
        if (cond.status != "3") {
          url = url + "&status=" + cond.status;
        }
      }
      console.log(url);
      this.$axios({
        method: "get",
        url: url,
        headers: {
          Authorization: "Bearer " + token
        }
      })
        .then(res => {
          if (res.status == "200") {
            this.isLoading = false;
            let data = res.data;
            this.userShowData = data;
            this.chuliData(this.userShowData);
            console.log(token);
            this.pageTotal = parseInt(res.headers["x-total-count"]);
          } else {
            this.$Message.error(res.data.detail);
          }
        })
        .catch(err => {
          this.$Message.error(err.response.data.message);
        });
    },
    //////////表格数据处理///////
    chuliData(arry) {
      arry.forEach(element => {

        if (element.status == 1) {
          element.status = "启用";
        } else {
          element.status = "未启用";
        }
      });
    },
    //条件搜索函数
    require() {
      let cond = {};
      if (this.searchCond) {
        cond.keyword = this.searchCond;
      }
      if (this.selectData) {
        cond.status = this.selectData;
      }
      return cond;
    },
    //确认按钮搜索
    ensureAction() {
      let cond = this.require();
      this.getUserData(0, cond);
    },
    //选择框搜索
    selectSearch() {
      this.pageNum = 1;
      let cond = this.require();
      this.getUserData(0, cond);
    },
    //换页
    handlePage(value) {
      this.pageNum = value;
      let cond = this.require();
      this.getUserData(this.pageNum - 1, cond);
    },
    //键盘事件
    keyset_1(ev) {
      if (ev.keyCode == 13) {
        let cond = this.require();
        this.getUserData(0, cond);
      }
    },
    //刷新定位函数
    reload() {
      if (localStorage.reLoad == "reLoadProjectDetail") {
        this.$router.push({
          name: "ProjectDetail",
          query: {
            param: localStorage.params,
            name: localStorage.proName
          }
        });
      }
    }
  },
  watch: {
    searchCond: function (value, odlValue) {
      if (!value) {
        let cond = {};
        cond = this.require();
        this.getUserData(0, cond);
      }
    }
  },
  created() {
    // this.reload();
  },
  mounted() {
    // this.getUserData("", this.selectStatus, 0);
    console.log(String(0));
    this.getUserData(0);
    this.gainUserSummary();
  }
};
</script>

<style scoped>
.wrapp {
  padding: 0 20px;
}

.head {
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
  padding: 10px 5px;
  display: flex;
  justify-content: space-between;
}

.title {
  color: #666;
  font-size: 24px;
}

.banner {
  margin-top: 20px;
}

.table {
  margin-top: 20px;
}

.balance {
  position: fixed;
  padding: 20px;
  top: 10%;
  right: 10%;
  left: 30%;
  /* bottom: 10%; */ /* overflow: scroll; */
  outline: 0;
  -webkit-overflow-scrolling: touch;
  background-color: lightgrey;
  filter: alpha(opacity=100);
  background-color: lightgrey;
  z-index: 9999;
}

.relateButton {
  display: flex;
  justify-content: space-around;
  margin-top: 20px;
}

.table_1 {
  width: 800px;
  margin: 0 auto;
  margin-top: 20px;
}

.ml {
  margin-left: 30px;
  font-size: 16px;
}

.balanceTitle {
  width: 500px;
  margin: 0 auto;
}
</style>
